<template>
  <div class="container">
    <div class="containerOne">
      <p class="text">扫码登录</p>
      <a-image
          width="200"
          :preview="false"
          :src="qrimg"
      />
    </div>
  </div>

</template>

<script setup>
import {getcheckApi, getcodeApi, getkeyApi, getstatusApi} from "~/commonApi/api"
import {ref} from "vue";
import {useCookies} from '@vueuse/integrations/useCookies'
import {useRouter} from "vue-router";
import {useStore} from "vuex";
import {toast} from "~/uilti/tool.js";
//获取一个key
const unikey = ref('')
const GetKey = async () => {
  const res = await getkeyApi()
  unikey.value = res.data.unikey
  GetCode(unikey.value)
}
//获取二维码
const qrimg = ref('')
const GetCode = async (key) => {
  const res = await getcodeApi(key)
  qrimg.value = res.data.qrimg
}
//轮询获取二位码状态

const store = useStore()
const router = useRouter()
let timerrr = setInterval(async () => {
  const res = await getcheckApi(unikey.value)
  //800二维码过期
  //801为等待扫码
  //802 为待确认
  //803 为授权登录成功
  if (res.code == 801) {
  } else if (res.code == 803) {
    await GetStatus()
    store.dispatch('getinfo').then(() => {
      toast('登录成功')
      sessionStorage.setItem('manner', 'qrCode')
      location.reload()
      router.push('/pagesFrist')
    })
    clearInterval(timerrr)
  } else if (res.code == '800') {
    clearInterval(timerrr)
  } else {
    // clearInterval(timerrr)
  }
}, 1000)

const GetStatus = async () => {
  const res = await getstatusApi()
  localStorage.setItem('id', res.data.account.id)
}


GetKey()


</script>

<style scoped lang="scss">
.container {


  .text {
    font-size: 20px;
    text-align: center;
  }
}

</style>